<template>
  <div
    class="user animate__animated animate__fadeIn"
    :style="{
      'background-image': 'url(' + fuzhou + ')',
      backgroundRepeat: 'no-repeat',
      backgroundSize: 'cover',
      display: 'flex',
      height: '100%',
    }"
  >
    <div class="card animate__animated animate__bounceIn">
      <router-view></router-view>
    </div>
  </div>
</template>

<script>
import fuzhou from "../../assets/fuzhou.jpg";
import { defineComponent } from "vue";

export default defineComponent({
  name: "userIndex",
  data() {
    return {
      fuzhou,
    };
  },
});
</script>

<style scoped>
.card {
  width: 400px;
  background: rgba(255, 255, 255, 0.7);
  margin: auto;
  box-shadow: 0 0 17px 10px grey;
  border-radius: 10px;
  padding: 40px 0;
}
</style>
